<template>
<div class="col-md-12">
  <my-navbar>
    <template slot="right">    
      <button class="btn btn-default" :disabled="!isDelable" @click.prevent="onDel">
        <span class="glyphicon glyphicon-trash"></span> {{$t('common.delete')}}
      </button>         
    </template> 
  </my-navbar>
  <div class="col-md-12">
    <my-table :cfg="cfg" :list="list" :loading="loading"></my-table>
  </div>  
</div>
</template>

<script>
import _ from 'lodash'
import settings from 'share/server/settings.js'
import locales from '../locales/scriptPluginList.js'
import {List} from '../configs/scriptPluginList.js'
import {scriptApi} from 'share/server/api.js'

export default {
  locales,
  data () {
    return {
      cfg: {
        checkable: true,
        showHead: true,
        columns: new List(this)       
      },
      list: [],
      loading: false
    }
  },
  computed: {
    isDelable () {
      var deletedCnt = 0
      _.forEach(this.list, (item) => {
        if (item._checked && item.isBuildIn === 0) {
          deletedCnt++
        }
      })

      return deletedCnt > 0
    }
  },
  methods: {
    onDel () {
      var filterPlugins = _.filter(this.list, (item) => {
        return item._checked && item.isBuildIn === 0
      })

      var plugins = _.map(filterPlugins, 'pluginId')

      msgbox.alert({
        title: this.$t('alert.areYouSure'),
        text: this.$t('alert.notBeRecovered') + this.$t('common.and') + this.$t('alert.needRestartService'),
        type: "warning",
        showCancelButton: true,
        confirmButtonColor: "#DD6B55",
        cancelButtonText: this.$t('common.cancel'),
        confirmButtonText: this.$t('common.confirm'),
        closeOnConfirm: false,
        showLoaderOnConfirm: true    
      }, 
      function() {
        scriptApi.sendCmd('del', plugins).then(function(res) {
          if (res && res.data && res.data.code === 0) {
            scriptApi.sendCmd('restartService') 
            setTimeout(function() {
              msgbox.close()
              this.loadPlugins()
            }, settings.restartWaitTime)                  
          } else {
            toast.code(this, res.data)
          }
        }.bind(this))
      }.bind(this))   
    },
    makePlugins (plugins) {
      _.forEach(plugins, function(item) {
        item._checked = false
        if (item.isBuildIn === 0) {
          item.typeStr = this.$t('types.thirdparty')
        } else {
          item.typeStr = this.$t('types.native')
        }        
      }.bind(this))
      this.list = _.sortBy(plugins, 'isBuildIn')
    },
    loadPlugins () {
      this.loading = true
      scriptApi.getStore().then(function(res) {
        if (res && res.data && res.data.code === 0) {
          this.makePlugins(res.data.data.plugins)
        } else {
          toast.code(this, res.data)
        }
        this.loading = false
      }.bind(this))
    }
  },
  ready () {
    this.loadPlugins()
  }
}
</script>

<style>
</style>